extends /templates/base-flat

include clan-league-stats-mixin

block page_nav
  include ./teacher-dashboard-nav

block content
  if (!me.isTeacher() && !me.isAdmin() && !view.classrooms.size()) || me.isAnonymous()
    .access-restricted.container.text-center.m-y-3
      h5(data-i18n='teacher.access_restricted')
      p(data-i18n='teacher.teacher_account_required')
      if me.isAnonymous()
        .login-button.btn.btn-lg.btn-primary(data-i18n='login.log_in')
        button.btn.btn-lg.btn-primary-alt.create-teacher-btn(data-event-action="Teachers Classes Create Teacher Account", data-i18n='teacher.create_teacher_account')
      else
        button.btn.btn-lg.btn-primary.update-teacher-btn(data-event-action="Teachers Classes Convert Teacher Account", data-i18n="teachers_quote.convert_account_title")
        button#logout-button.btn.btn-lg.btn-primary-alt(data-i18n="login.log_out")

    .container
      .teacher-account-blurb.text-center.col-xs-6.col-xs-offset-3.m-y-3
        h5(data-i18n='teacher.what_is_a_teacher_account')
        p(data-i18n='teacher.teacher_account_explanation')

  else
    if !me.isTeacher() && !me.isAdmin()
      .alert.alert-danger.text-center
        .container
          //- DNT: Temporary
          h3 ATTENTION: Please upgrade your account to a Teacher Account.
          p
            | We are transitioning to a new improved classroom management system for instructors.
            | Please convert your account to ensure you retain access to your classrooms.
          button.btn.btn-primary.btn-lg.update-teacher-btn(data-event-action="Teachers Classes Convert Teacher Account Temp") Upgrade to teacher account

    - var officeHours = view.upcomingOfficeHours;
    - var limit = view.howManyOfficeHours == 'all' ? Infinity : 2;
    - var limited = officeHours.length > 2;
    - var limitedOfficeHours = officeHours.slice(0, limit);
    #office-hours
      if officeHours.length && view.howManyOfficeHours != 'none'
        .update-class.rtl-allowed
          button.close.see-no-office-hours(data-dismiss="alert" aria-label="Close")
            span(aria-hidden=true) &times;
          .alert.alert-info.text-center.rtl-allowed
            strong(data-i18n='teacher.office_hours')
            .small-details.rtl-allowed
              span.spr(data-i18n='teacher.office_hours_detail')
              //a(data-i18n="teacher.office_hours_link" href="https://blog.codecombat.com/live-events/")
              span(data-i18n="teacher.office_hours_link")
              span.spl(data-i18n="teacher.office_hours_detail_2")
            ul.list-group
              for oh in limitedOfficeHours
                li.list-group-item
                  span.spr #{moment(oh.time).calendar(null, {sameElse: 'ddd MMM D, LT'})}:
                  a(href=oh.link target="_blank")= oh.name
                  span.spl.spr(data-i18n="general.with")
                  span #{oh.host} (#{moment(oh.time).fromNow()})
            if view.howManyOfficeHours == 'all' && limited
              a.see-less-office-hours.btn.btn-small.btn-primary.pull-right(data-i18n="general.fewer") Fewer
            else if view.howManyOfficeHours == 'some' && limited
              a.see-all-office-hours.btn.btn-primary.btn-small.pull-right(data-i18n="general.more") More

    if !me.hideOtherProductCTAs()
      .banner-hoc

    .container
      +teacher-quests

    .container.top-container
      div#classes-nag-subview

      if !view.chinaInfra
        .alert.alert-warning
          strong(data-i18n='teacher.dashboard_deprecation_message')

      h3
        span(data-i18n='teacher.current_classes')
        #dashboard-toggle(:show-title="true", size="sm")
        a.pull-right(href='/outcomes-report/teacher/' + me.get('_id') target="_blank" data-i18n='outcomes.view_outcomes_report')

    .classes.container
      // Loop each owned class
      each classroom in view.classrooms.models
        unless classroom.get('archived')
          if classroom.isOwner() && !(me.isAdmin() && classroom.get('ownerID') != view.teacherID)
            +classRow(classroom)

    if _.filter(view.classrooms.models || [], (c) => !c.get('archived') && c.get('ownerID') != view.teacherID && c.hasReadPermission()).length
      .container
        div#classes-shared-subview

        h3
          span(data-i18n='teacher.shared_classes')

      .classes.container
        // Loop each shared class
        each classroom in view.classrooms.models
          unless classroom.get('archived')
            if classroom.get('ownerID') != view.teacherID && classroom.hasReadPermission()
              +classRow(classroom)

    if view.administratingTeachers && view.administratingTeachers.size() > 0
      .container
        .school-admin-notification
          span(data-i18n='school_administrator.notice')
          | &nbsp;
          span
            each teacher, index in view.administratingTeachers.models
              = teacher.get('firstName')
              | &nbsp;
              = teacher.get('lastName')
              | &nbsp;
              | (
              a(href='mailto:' + teacher.get('email'))
                = teacher.get('email')
              | )
              if index !== view.administratingTeachers.models.length - 1
                | ,&nbsp;


    +createClassButton

    +clanLeagueStatsMixin(view.aiLeagueStats, (view.teacherClan ? view.teacherClan._id : null), true, null)

    if !me.hideOtherProductCTAs() && !(me.get('activity') && me.get('activity')['visit-ozaria'])
      .container.try-ozaria
        a(data-i18n="teacher.try_ozaria_footer")

  - var archivedClassrooms = view.classrooms.where({archived: true});
  if _.size(archivedClassrooms)
    .container
      h3(data-i18n='teacher.archived_classes')
      p(data-i18n='teacher.archived_classes_blurb')

    .classes.container
      each classroom in archivedClassrooms
        +archivedClassRow(classroom)

  .container.latest-podcast
    h5.text-h5(data-i18n='teacher.from_the_podcast')
    .podcast-item-container

mixin classRow(classroom)
  .class.row.rtl-allowed(dir="auto")
    .class-details-col.rtl-allowed(dir="auto")
      .text-h4.semibold.rtl-allowed(dir="auto")
        = classroom.get('name')
      .language.small.rtl-allowed(dir="auto")
        span(data-i18n='teacher.language')
        | :&nbsp;
        span.language-name
          = classroom.capitalLanguage
      | &nbsp;
      .student-count.small.rtl-allowed(dir="auto")
        span(data-i18n='courses.students')
        | :&nbsp;
        span
          = classroom.get('members').length
      if classroom.getDisplayPermission()
        .shared-access.small.rtl-allowed(dir="auto")
          | &nbsp;
          | &nbsp;
          span(data-i18n='teacher.permission')
          | :&nbsp;
          span=classroom.getDisplayPermission()
      .class-links.rtl-allowed(dir="auto")
        a.view-class-btn.text-h6(data-i18n='teacher.view_class' data-classroom-id=classroom.id data-event-action="Teachers Classes View Class Link")
        if classroom.isOwner()
          a.view-ai-league.text-h6(data-i18n='teacher.view_ai_league_team' data-clan-level='classroom' data-clan-source-object-id=classroom.id data-event-action="Teachers Classes View AI League Team")
        if classroom.hasWritePermission()
          a.edit-classroom.text-h6(data-i18n='teacher.edit_class_settings' data-classroom-id=classroom.id data-event-action="Teachers Classes Edit Class Started")
          a.archive-classroom.text-h6(data-i18n='teacher.archive_class' data-classroom-id=classroom.id data-event-action="Teachers Classes Archive Class")
        if classroom.isOwner()
          a.share-class.text-h6(data-i18n='teacher.share_class', data-classroom-id=classroom.id data-event-action="Teachers Share Class")

    .flex-right
      .progress-col
        if classroom.get('members').length == 0
          +addStudentsButton(classroom)
        else
          // TODO: next line has a race condition if classroom loads before courses. For now, made following logic handle nulls.
          - var courses = classroom.getSortedCourses().map(function(c) { return view.courses.get(c._id); });
          - var courseLabelsArray = view.helper.courseLabelsArray(courses);
          each trimCourse, index in classroom.getSortedCourses() || []
            - var course = view.courses.get(trimCourse._id);
            - var label = courseLabelsArray[index];
            if course
              +progressDot(classroom, course, label)
      .view-class-arrow
        a.view-class-arrow-inner.glyphicon.glyphicon-chevron-right.view-class-btn(data-classroom-id=classroom.id data-event-action="Teachers Classes View Class Chevron")


mixin addStudentsButton(classroom)
  .add-students
    .text-center
      div.small-details(data-i18n='teacher.no_students_yet_view_class')

mixin createClassButton
  .create-class
    .text-center
      a.create-classroom-btn.btn.btn-lg.btn-primary(data-i18n='teacher.create_new_class')

mixin progressDot(classroom, course, label)
  //- TODO: inefficient. Cache this in the view?
  - courseInstance = view.courseInstances.findWhere({ courseID: course.id, classroomID: classroom.id })
  if !courseInstance && view.sharedCourseInstances
    - courseInstance = view.sharedCourseInstances.findWhere({ courseID: course.id, classroomID: classroom.id })
  - var total = classroom.get('members').length
  - var complete = 0;
  - var dotClass = '';
  - var started = 0;
  if courseInstance && !_.isEmpty(courseInstance.get('members'))
    - complete = courseInstance.numCompleted
    - started = courseInstance.started
    - percentLevelCompletion = courseInstance.percentLevelCompletion
    - dotClass = complete === total ? 'forest' : started ? 'gold' : '';
    - var progressDotContext = {total: total, complete: complete, loading: !courseInstance.sessionsLoaded, percentLevelCompletion: percentLevelCompletion};
    .progress-dot(class=dotClass, data-title=view.progressDotTemplate(progressDotContext))
      +progressDotLabel(label)

mixin progressDotLabel(label)
  .dot-label.text-h6= label

mixin archivedClassRow(classroom)
  .class.row
    .col-xs-10(dir="auto")
      span
        = classroom.get('name')
    .col-xs-2
      .class-links.pull-right(dir="auto")
        a.unarchive-classroom.text-h6(data-i18n='teacher.unarchive_class' data-classroom-id=classroom.id)

mixin teacher-quests
  - var lastComplete = null;
  - var nextIncomplete = null;
  - var numComplete = 0;
  - var totalQuests = 0;
  each quest in view.teacherQuestData
    - totalQuests++;
    if quest.complete
      - lastComplete = quest;
      - numComplete++;
    else if !nextIncomplete
      - nextIncomplete = quest;
  if lastComplete
    - lastComplete.lastComplete = true;
  if nextIncomplete
    - nextIncomplete.nextIncomplete = true;
  - var percentComplete = totalQuests ? Math.round(numComplete * 100.0 / totalQuests) : 0;
  if view.prepaids.length < 1 && me.canManageLicensesViaUI()
    .teacher-quests
      .row
        .col-sm-3.quests-summary-col
          .quest-progress.center #{percentComplete}%
          .center
            if numComplete != totalQuests
              .el
                - var height = 100;
                svg(width=height, height=height)
                  - var radius = height / 2;
                  - var fullCircleStroke = 2*Math.PI*radius / 2
                  circle.bottom(r=radius,cx=radius,cy=radius)
                  circle.top(r=radius / 2,cx=radius,cy=radius,style=`stroke-dasharray: ${fullCircleStroke/100*percentComplete} ${fullCircleStroke}`)
          .center.completion-label(data-i18n="teacher.quests_complete")
        .col-sm-9.quests-list-col
          if numComplete != totalQuests
            h3(data-i18n="teacher.teacher_quest")
            strong.center!= view.translateWithMarkdown('teacher.teacher_quest_keep_going')
          else
            br
            strong.center!= view.translateWithMarkdown('teacher.teacher_quest_done')
          ul
            each quest in view.teacherQuestData
              if quest.complete
                if quest.lastComplete && numComplete != totalQuests
                  li.quest.quest-complete
                    +teacherQuest(quest,true)
                else
                  li.quest.quest-complete.hide
                    +teacherQuest(quest,true)
              else
                if quest.nextIncomplete
                  li.quest.quest-incomplete
                    +teacherQuest(quest,false)
                else
                  li.quest.quest-incomplete.hide
                    +teacherQuest(quest,false)
          .div
            span(data-i18n="teacher.refresh_to_update").refresh-help
            a.see-all-quests.btn.btn-primary.btn-small.pull-right(data-i18n="teacher.teacher_quest_more")
            a.see-less-quests.btn.btn-small.btn-primary.pull-right(data-i18n="teacher.teacher_quest_less" style="display: none")

mixin teacherQuest(quest,check)
  div.quest-title
    if check
      span.glyphicon.glyphicon-check
    else
      span.glyphicon.glyphicon-unchecked
    span !{quest.title}
  //[!{Math.floor(quest.best*100)}%]
  if (quest.steps || []).length > 0
    ul
      each step in quest.steps || []
        li
          if check
            span.glyphicon.glyphicon-check
          else
            span.glyphicon.glyphicon-unchecked
          span !{step}

